<script setup lang="ts">
import { ref } from "vue";
import { Content, Meat } from "@/store/interface.ts";
//import { dataLocal } from "@/store/store.ts";
import Ifarm from "@/components/block/ifarm.vue";

defineProps<{ data: Content; meat: Meat }>();

//准备默认值
//const content = dataLocal.single.content;



//弹窗状态
const active = ref(false);
//弹窗按钮
const clickActive = () => {
  active.value = !active.value;
};
</script>

<template>
  <div class="px-6 lg:px-14 py-4 lg:border-x lg:overflow-y-auto lg:content">
    <div class="entry-content">
      <div class="content-excerpt">
        {{ data.post_excerpt }}
      </div>
      <div class="content" v-html="data.post_content"></div>

      <slot></slot>
     
    </div>

    <!--
      统一内容
    -->

    <a
      class="apply-button-mobile mt-5 text-white text-sm font-semibold flex items-center justify-center h-10 lg:hidden"
      @click="clickActive"
      v-if="meat.site !== ''"
    >
      <Ifarm :active="active" :site="meat.site" :title="data.post_title" />
    </a>
  </div>
</template>

<style scoped lang="less">
//文章样式
:deep(h2) {
  --tw-text-opacity: 1;
  color: rgb(148 163 184 / var(--tw-text-opacity));
  font-weight: 600;
  font-size: 0.75rem;
  line-height: 1rem;
  margin-top: 1.5rem;
}

:deep(p) {
  font-size: 0.875rem;
  line-height: 1.25rem;

  --tw-text-opacity: 1;
  color: rgb(51 65 85 / var(--tw-text-opacity));
  margin-top: 0.5rem;
}
:deep(ul) {
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(51 65 85 / var(--tw-text-opacity));
  li {
    margin-top: 0.5rem;
  }
  li::before {
    color: #de0718;
    content: "•";
    display: inline-block;
    font-weight: 700;
    margin-left: 0.5em;
    width: 1em;
  }
}

/*移动端底部按钮*/
.apply-button-mobile {
  background: linear-gradient(
      180deg,
      hsla(0, 0%, 100%, 0.8),
      hsla(0, 0%, 100%, 0)
    ),
    #cb1b1b;
  background-blend-mode: soft-light, normal;
  border-radius: 6px;
}
.apply-button-mobile {
  border: 0.66px solid hsla(0, 0%, 100%, 0.5);
}
.mail-to {
  color: #de0718;
  font-family: PingFang SC;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

.ul-type li::before {
  color: rgb(222, 7, 24);
  content: "•";
  display: inline-block;
  font-weight: 700;
  margin-left: 0.5em;
  width: 1em;
}

//描述
.content-excerpt {
  margin: 0 0 1rem;
  font-size: 12px;
  color: #9d9d9d;
}
</style>
